<#include "include/_meta.html">
<title>年检记录列表</title>
</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 车辆管理<span class="c-gray en">&gt;</span> 车辆保养记录 <a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a></nav>
<div class="page-container">
	<div class="text-c">
		<input type="text" class="input-text" style="width:250px" placeholder="车牌号" id="likecarid" name="">
		 开始时间：
		<input type="text" onfocus="WdatePicker({maxDate:'#F{$dp.$D(\'datemax\')||\'%y-%M-%d\'}'})" id="datemin" class="input-text Wdate" style="width:120px;">
		截止时间：
		<input type="text" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'datemin\')}',maxDate:'%y-%M-%d'})" id="datemax" class="input-text Wdate" style="width:120px;">
		
		<button type="submit" class="btn btn-success" id="searchYearCheck" name=""><i class="Hui-iconfont">&#xe665;</i> 搜索</button>
	</div>
	<div class="cl pd-5 bg-1 bk-gray mt-20"> <span class="l"><#--<a href="javascript:;" onclick="datadel()" class="btn btn-danger radius"><i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>-->
			<a href="javascript:;" id="addYearCheck" class="btn btn-primary radius"><i class="Hui-iconfont">&#xe600;</i> 添加年检记录</a></span>
		<span class="r">共有数据：<strong id="pageTotal">54</strong> 条</span> </div>
	<table id="yearchackTable" class="table table-border table-bordered table-bg table-hover">
		<thead>
			<tr>
				<th scope="col" colspan="9">年检列表</th>
			</tr>
			<tr class="text-c">
				<th width="25"><input type="checkbox" name="yearcheckitem" value=""></th>
				<!--<th width="40">ID</th>-->
				<th width="150">年检车辆</th>
				<th width="150">年检地点</th>
				<th width="150">外出时间</th>
				<th width="150">归还时间</th>
				<th width="130">年检费用</th>
				<th width="100">经手人</th>
				<th width="100">操作</th>
			</tr>
		</thead>
		<tbody>
		<tr v-for="(item,index) in result" class="text-c">
			<td><input type="checkbox" name="yearCheckitem" value=""></td>
			<td>{{item.carIdCard}}</td>
			<td>{{item.place}}</td>
			<td>{{item.yearCheckStart}}</td>
			<td>{{item.yearCheckEnd}}</td>
			<td>{{item.money}}</td>
			<td>{{item.userName}}</td>
			<td>
				<a v-if="item.yearCheckId!=null" href="#" @click="editEvent(item.yearCheckId)">编辑</a>
				<a v-if="item.yearCheckId!=null" href="#" @click="delEvent(item.yearCheckId)">删除</a>
			</td>
		</tr>
		</tbody>
		<tr>
			<td colspan="2">
				<div id="pagenav"></div>
			</td>
		</tr>
	</table>
</div>

<#include "include/_footer.html">

<script>
	var app = new Vue({
		el: '#yearchackTable',
		data: {
			result: []
		}
	});
	var getYearCheckList = function (curr) {
		$.ajax({
			type: "post",
			dataType: "json",
			url: "/yearCheckList",
			data: {
				PageNum: curr || 1,
				carIdCard: $("#likecarid").val(),
				maintainStart: $("#datemin").val(),
				maintainEnd: $("#datemax").val(),
				PageSize: 10
			},
			success: function (result) {
				app.result = result.page.records;
				$("#pageTotal").text(result.page.total);
				laypage({
					cont: "pagenav",
					first: "首页",
					pages: result.totalPage,
					skin: "#DB7023",
					last: "最后一页",
					curr: curr || 1,
					jump: function (obj, first) {
						if (!first) {
							loadcheck(obj.curr);
						}
					}
				});
			}
		})
	};

	getYearCheckList();

	$("#searchYearCheck").click(function () {
		getYearCheckList();
	});

	//删除
	var delEvent = function (id) {
		layer.confirm("是否确认删除", {
			btn: ['是', '否']
		}, function () {

			console.log("id===" + id);
			$.ajax({
				type: 'POST',
				dataType: 'json',
				url: '/delYearCheck',
				data: {
					yearCheckId: id,
					state: 1
				},
				success: function (result) {
					getYearCheckList();
					if (result.flag == 1) {
						layer.msg(result.flag + ":" + result.msg, {icon: 6});
					} else {
						layer.msg(result.flag + ":" + result.msg, {icon: 5});
					}
				}
			});
		}, function () {

		})
	};

	//编辑
	var editEvent = function (id) {
		layer.open({
			type: 2,
			title: "年检记录编辑",
			fix: false,
			maxmin: true,
			shadeClose: true,
			area: ['1000px', '600px'],
			content: "/toUpdateYearCheck?yearCheckId=" + id,
			end: function () {
				getYearCheckList();
			}
		})
	};

	//新增
	$("#addYearCheck").on("click", function () {
		layer.open({
			type: 2,
			title: '添加年检记录',
			fix: false,
			maxmin: true,
			shadeClose: true,
			area: ['1000px', '600px'],
			content: 'toAddYearCheck',
			end: function () {
				getYearCheckList();
			}
		});
	});
</script>

</body>
</html>